<template name="personList" ref="personList">
	<view>
		<view :style="styles" class="bgk" @click="selectPerson">点击该区域取消</view>
		<view :style="styles" class="show_box_content">
			<view class="title">选择就诊人</view>
			<scroll-view scroll-y="true" style="max-height: 70%;overflow-y: scroll;">
				<ul>
					<li v-for="(item,index) in personListData" :key="index">
						<view class="person_info" v-on:click="checkedPerson(item)">
							<b>{{item.xming0}}({{item.sfzh00}})</b>
							<p>手机号：{{item.lxdh00}}</p>
						</view>
						<view class="update_icon" @click="updatePerson(item)"></view>
					</li>
				</ul>
			</scroll-view>
			<button class="add_person_btn" @click="addPerson">添加新就诊人</button>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				showBox: false,
				styles:"display:none;",
				personListData: []
			}
		},
		props:["medicalData"],
		mounted() {
			this.showBox=this.show;
			
		},
		created() {
			this.showBox=this.show;
			this.init();
		},
		methods: {
			init(){
				//初始化数据，根据当前用户去获取相关的绑定就诊人
				let user=uni.getStorageSync("user");
				let params={
					kh0000:user.sfzh00,
					xming0:user.xming0,
					funid:"F07.02.02.04"
				}
				this.$postJson("/qnyesb/qnyesbproxy",params,res=>{
					if(res.state==0){
						this.personListData=res.data.retrieve;
					}else{
						this.personListData=[];
						/* uni.showModal({
							title:"温馨提示",
							content:"您尚未关联就诊人，是否现在去关联",
							success(res) {
								if(res.confirm){
									uni.navigateTo({
										url:"../bindInfo/bindInfo"
									})
								}else{
									uni.switchTab({
										url:"../index/index"
									})
								}
							}
						}) */
					}
				})
			},
			selectPerson() {
				if(this.personListData.length>0){
					if (this.styles=="") {
						this.styles="display:none;"
					} else {
						this.styles="";
					} 
				}else{
					//跳转到添加就诊人页面
					uni.showModal({
						title:"温馨提示",
						content:"您现在暂无关联其他就诊人，是否现在关联",
						success(res) {
							if(res.confirm){
								uni.navigateTo({
									url:"/pages/bindInfo/bindInfo"
								})
							}
						}
					})
				}
				 
			},
			checkedPerson(item) {
				this.styles = "display:none;";
				//this.medicalData = item;
				this.$emit("checkedPerson",item)
			},
			updatePerson(item) {
				//跳转到就诊人修改页面
			},
			addPerson() {
				//跳转到就诊人增加页面
				uni.navigateTo({
					url:"/pages/appointment/appointment"
				})
			},
			sureRegistration() {
				//确定挂号，生成预挂号信息，不进HIS，本地进行存储，支付完成后进入HIS
			}
		}
	}
</script>

<style>
	.bgk{
		position: fixed;
		width: 100%;
		height: 100%;
		z-index: 998;
		background: rgba(0, 0, 0, 0.39);
		top: 0;
		text-align: center;
		line-height: 200px;
		color: #FFFFFF;
	}
	.show_box_content{
		position: fixed;
		z-index:999; 
		bottom: 0px;
		height: 50%;
		background-color: #FFFFFF;
		width: 100%;
		transition: height .1s linear;
		border-radius: 10px 10px 0px 0px;
		font-size: 16px;
	}
	.show_box_content .title{
		margin-top: 10px;
		text-align: center;
	}
	.show_box_content ul{
		width: 100%;
		margin-top: 10px;
	}
	.show_box_content ul li{
		width: 92%;
		margin: 0 auto;
		border-bottom: 1px solid #F0F0F0;
		padding: 15px;
		display: flex;
		
	}
	.show_box_content ul li:last-child{
		border: none;
	}
	.show_box_content ul li .person_info{
		float: left;
		width: 88%;
		line-height: 30px;
	}
	.show_box_content ul li .person_info p{
		color:#999999 ;
	}
	.show_box_content .update_icon{
		float: right;
		margin-top: 15px;
	}
	.show_box_content .add_person_btn{
		width: 96%;
		margin-top: 30px;
		background-color: #3692FF;
		border-radius: 21px;
		color: #FFFFFF;
	}
	.update_icon{
		width: 36px;
		height: 36px;
		background-image: url(../static/311@2x.png);
		background-size: 100% 100%;
	}
</style>
